import React, {useState} from 'react';
import {Link} from "react-router-dom"
import './home.scss'

function Login(param: any) {
    return (
        <div>
            <div className="item">
                <i className={'iconfont icon-gerentouxiang_o'}></i>
                <input type="text" placeholder={'请输入邮箱号'}/>
            </div>
            <div className="item">
                <i className={'iconfont icon-gerentouxiang_o'}></i>
                <input type="text" placeholder={'请输入验证码'}/>
            </div>
            <div className="item">
                <i className={'iconfont icon-gerentouxiang_o'}></i>
                <input type="text" placeholder={'请输入密码'}/>
            </div>
            <div className="item">
                <i className={'iconfont icon-gerentouxiang_o'}></i>
                <input type="text" placeholder={'请再次输入密码'}/>
            </div>
            <div className="item btn">
                立 即 注 册
            </div>
        </div>
    )
}

function Denglu(param: any) {
    console.log(param)
    return (
        <div>
            <div className="item">
                <i className={'iconfont icon-gerentouxiang_o'}></i>
                <input type="text" placeholder={'请输入密码'}/>
            </div>
            <div className="item">
                <i className={'iconfont icon-gerentouxiang_o'}></i>
                <input type="text" placeholder={'请再次输入密码'}/>
            </div>
            <div className="item btn">
                立 即 登 陆
            </div>
            <div className={'footer'}>
                <div className={'footer-item'}>忘记密码</div>
                <div className={'footer-item'}  onClick={()=>{param.setCountF(1)}}>立即注册</div>
            </div>
        </div>
    )
}

function App() {
    const [count, setCount] = useState(0);
    console.log(count === 1)
    let Bo: any = '';
    function setCountF(val:any) {
        setCount(val);
    }
    if (count === 0) {
        Bo = <Denglu setCountF={setCountF}></Denglu>
    } else {
        Bo = <Login setCountF={setCountF}></Login>
    }
    return (
        <div className="App">
            <div className={'juzhong'}>
                <div className="left">
                    <img src="" alt=""/>
                </div>
                <div className="right">
                    <div className="contain">
                        <div style={{
                            marginTop: '50px'
                        }}>
                            <div className="item logo">logo</div>
                            {Bo}
                        </div>
                    </div>
                </div>
            </div>
        </div>
    );
}

export default App;
